<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<%@ page isELIgnored="false" %>
<%@ include file="../foreHander1.jsp"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>


<div class="breadcrumb-area pt-15 pb-15">
    <div class="container">
        <div class="row">
            <div class="col-lg-12">
                <!--=======  breadcrumb container  =======-->

                <div class="breadcrumb-container">
                    <nav>
                        <ul>
                            <li class="parent-page"><a href="/fore/foreIndex">Home</a></li>
                            <li>Customer</li>
                        </ul>
                    </nav>
                </div>

                <!--=======  End of breadcrumb container  =======-->
            </div>
        </div>
    </div>
</div>

<style>
    .order_goods_list li{float:left; height:80px;line-height:80px;}
    .order_goods_list .col01{width:20%}
    .order_goods_list .col01 img{width:60px;height:60px;border:1px solid #ddd;margin:10px auto;}
    .order_goods_list .col02{width:24%;text-align:center;}
    .order_goods_list .col02 em{color:#999;margin-left:10px}
    .order_goods_list .col03{width:10%}
    .order_goods_list .col04{width:20%}

    .order_list_th{width:1107.2px;border:1px solid #ddd;background-color:#f7f7f7;margin:20px auto 0;}
    .order_list_th li{float:left;height:30px;line-height:30px}
    .order_list_th .col01{width:35%;margin-left:20px}
    .order_list_th .col02{width:20%}
</style>
<!--=== My Account page content ===-->

<div class="page-section mb-50">
    <div class="container">
        <div class="row">
            <div class="col-12">
                <div class="row">
                    <!-- My Account Tab Content Start -->
                    <div class="col-lg-12 col-12">
                        <div class="tab-content" id="myaccountContent">
                            <!-- Single Tab Content Start -->
                            <div class="tab-pane fade show active"  role="tabpanel">
                                <div class="myaccount-content">
                                    <h3>个人信息</h3>
                                    <form action="/modAtCustomer" method="post" class="row modCustomer" enctype="multipart/form-data">
                                        <input type="hidden" name="id" value="${customer.id}">
                                        <input type="hidden" name="imageUrl" id="imageUrl" value="11">
                                        <div class="form-group col-md-12">
                                            个人头像：<img class="headerImg" onclick="onclickFile()" src="${pageContext.request.contextPath}/Admin/${customer.imageUrl}" width="80px" height="80px" style="border-radius: 50px"/>
                                            <input type="file" onchange="uploadImage(this)" name="uploadHeaderImg" id="upHeaderImg" style="display: none"/>
                                        </div>
                                        <div class="form-group col-md-12">
                                            用户名：
                                            <input type="text" class="form-control" id="name" name="name" value="${customer.name}" readonly />
                                        </div>
                                        <div class="form-group col-md-12">
                                            <label for="address">地址：</label>
                                            <input type="text"  class="form-control" id="address" name="address" value="${customer.address}" required
                                                   placeholder="请输入地址"/>
                                        </div>
                                        <div class="form-group col-md-12">
                                            <label for="phone">手机：</label>
                                            <input type="text" class="form-control" id="phone" name="phone" value="${customer.phone}" required pattern="^(13[0-9]|14[01456879]|15[0-35-9]|16[2567]|17[0-8]|18[0-9]|19[0-35-9])\d{8}$"
                                                   placeholder="请输入手机号"/>
                                            <span style="color: #a1a0a0; font-size: 3px">*请输入正确的手机号</span>
                                        </div>
                                        <div class="form-group col-md-12">
                                            <button type="submit" class="btn btn-primary ajax-post changePwdForm" target-form="add-form">确
                                                定
                                            </button>
                                            <button type="button" class="btn btn-default backIndex" onclick="javascript:history.back(-1);return false;">返 回
                                            </button>
                                            <button type="button" class="btn btn-primary ajax-post changePwdForm" target-form="add-form" onclick="changePwd()">
                                                重置密码
                                            </button>
                                        </div>
                                    </form>
                                 </div>
                             </div>
                    <!-- Single Tab Content End -->
                    </div>
            </div>
        <!-- My Account Tab Content End -->
        </div>

                </div>
                </div>
        </div>
        </div>
<!-- 模态框（Modal） -->
<div class="modal fade" id="myModal" tabindex="-1" role="dialog"  id="myModal" aria-labelledby="myModalLabel" aria-hidden="true" data-backdrop="true">
    <div class="modal-dialog">
        <div class="modal-content">
            <!--登陆框头部-->
            <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal" aria-hidden="true">
                    ×
                </button>
                <h4 class="modal-title" id="myModalLabel">
                    商品评价!
                </h4>
            </div>
            <!--登陆框中间部分(from表单)-->
            <div class="modal-body">
                <!--评价-->
                <div class="form-group">
                    <label for="contents" class="col-sm-4 control-label">用户评价</label>
                    <div class="col-sm-12">
                        <textarea class="form-control" name="content" id="contents" placeholder="Say you want to say..." required="required"></textarea>
                    </div>
                </div>
                <!--登陆按钮-->
                <div class="form-group">
                    <div class="col-sm-offset-2 col-sm-10">
                        <button type="button" class="btn btn-default" data-dismiss="modal">关闭</button>
                        <button type="button" class="btn btn-default"  id="modalpinglun">评价</button>
                    </div>
                </div>
                <%--</form>--%>
            </div>
        </div>
    </div>
</div>

<script src="${pageContext.request.contextPath}/Fore/js/jquery/2.0.0/jquery.min.js"></script>
<script type="text/javascript">

    function onclickFile(){
        $("#upHeaderImg").click();
    }

    //图片上传
    function uploadImage(fileDom) {
        //获取文件
        var file = fileDom.files[0];
        //判断类型
        var imageType = /^image\//;
        if (file === undefined || !imageType.test(file.type)) {
            alert("请选择图片！");
            return;
        }
        // 清空值
        $(fileDom).val('');
        var formData = new FormData();
        formData.append("userHeaderImg", file);

        $.ajax({
            url: "/userHeaderImg",
            type: "post",
            data: formData,
            contentType: false,
            processData: false,
            dataType: "json",
            mimeType: "multipart/form-data",
            success: function (data) {
                $(".headerImg").attr("src",${pageContext.request.contextPath}"/Admin/" + data.fileName);
            },
            beforeSend: function () {
            },
            error: function () {

            }
        });
    }

    // 重置密码
    function changePwd(){
        location.href="${pageContext.request.contextPath}/Fore/forepage/changeCustomerPwd.jsp";
    }
</script>
<!--====  End of My Account page content  ====-->
<%@ include file="../foreFooter.jsp"%>